<template>
  <div class="app-container">

    <CommonTable ref="commonTable" :qo="qo" :baba="this" :need-load-dict-type="['system_notice_type']">
      <!-- 查询参数 -->
      <template slot="filterItems">
        <el-form-item label="关键字" prop="keyword">
          <el-input v-model.trim="qo.keyword" clearable />
        </el-form-item>
        <el-form-item label="公告类型" prop="type">
          <el-select v-model="qo.type" clearable>
            <el-option v-for="item in this.$store.getters.dictSelectData.system_notice_type" :key="item.value" :value="item.value" :label="item.label" />
          </el-select>
        </el-form-item>
      </template>
      <!-- 列表头 -->
      <template slot="column">
        <el-table-column label="标题">
          <template slot-scope="{row}">
            <el-link type="primary" @click="showNoticeDialog(row)">{{ row.title }}</el-link>
          </template>
        </el-table-column>
        <el-table-column label="公告类型">
          <template slot-scope="{row}">
            <el-tag type="success" effect="light">{{ 'system_notice_type'|transferDictValue(row.type) }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="失效时间" prop="expiredDate" />
        <el-table-column label="创建日期" prop="dateCreated" />
        <el-table-column label="修改日期" prop="lastUpdated" />
      </template>
    </CommonTable>
    <NoticeDialog ref="noticeDialog" />
  </div>
</template>

<script>
import { list } from '@/api/system/notice'
import NoticeDialog from '@/components/NoticeDialog'
import CommonTable from '@/components/CommonTable'
export default {
  name: 'NoticeList',
  components: { CommonTable, NoticeDialog },
  data() {
    return {
      qo: { type: '', keyword: '' }, typeOptions: []
    }
  },
  created() {
  },
  methods: {
    getData(qoPro) {
      return list(qoPro)
    },
    create() {
      this.$router.push({ path: '/system/notice/create' })
    },
    update(row) {
      this.$router.push({ path: '/system/notice/edit', query: { id: row.id }})
    },
    showNoticeDialog(row) {
      this.$refs.noticeDialog.show(row.id)
    }
  }
}
</script>
